<template>
    <div>
      <e-header></e-header>
      <!--导航-->
      <e-nav :navItems="navItems"></e-nav>
      <!--内容区开始-->
      <div class="contentView">
        <router-view  ></router-view>
      </div>
    </div>
</template>
<script>
  import nav from './headerNav/nav.vue'
  import header from './headerNav/header.vue'
  export default {
    props: ["navItems"],
    data(){
      return {
        token:"",
        allCompanies: [],
        transitionName:''
      }
    },
    created(){

      this.basicData()
      this.getCompanies()

    },
    mounted(){


    },
    methods: {

      //     获取基础数据  process.env.NODE_ENV === 'development'
      basicData(){
        let  districtData=JSON.parse(localStorage.getItem('districtData')?localStorage.getItem('districtData'):"[]")
        if(districtData.length>0){
          this.$store.commit("getDistrictData",districtData)
        }else {
          this.axios.post(process.env.API_HOST + '/common/selectRegion',{regionType:0})
            .then(response => {
              const result = response.data
              if(result.code==200){
                this.$store.commit('getDistrictData',result.result)
                localStorage.setItem('districtData',JSON.stringify(result.result));
              }
            })
        }
      },
      getCompanies(){
        let  districtData=JSON.parse(localStorage.getItem('getCompanies')?localStorage.getItem('getCompanies'):"[]")
        if(districtData.length>0){
          this.$store.commit("getCompanies",districtData)
        }else {
        this.axios.post(process.env.API_HOST + `/enterprise/selectEnterpriseList`, {
          enterpriseType: '1',
          enterpriseStatus: "0"
        })
          .then(response => {
            const result = response.data
            if (result.code == 200) {
              let companiess = []
              this.sortByKey(result.result, "enterpriseNo").forEach(item => {
                    companiess.push({
                      "enterpriseId": item.enterpriseId,
                      "enterpriseNo": item.enterpriseNo,
                      "enterpriseName": item.enterpriseAlias,
                      "enterpriseAlias": item.enterpriseAlias?item.enterpriseAlias:item.enterpriseName,
                        count: 0,
                        color: item.color,
                    })
              })
              this.$store.commit("getCompanies",companiess)
              localStorage.setItem('getCompanies',JSON.stringify(companiess));
            }
          })}
        // this.axios.post(process.env.API_HOST + `/common/selectExamineAgencyList`, { })
        //   .then(response => {
        //     const result = response.data
        //     if (result.code == 200) {
        //       this.$store.commit("getGovAgencyList",  result.result)
        //     }
        //   })
      },

    },
    components: {
      'e-nav': nav,
      'e-header': header,
    },
    watch: {//使用watch 监听$router的变化
      $route(to, from) {
        //如果to索引大于from索引,判断为前进状态,反之则为后退状态
        if(to.meta.index > from.meta.index){
          //设置动画名称
          this.transitionName = 'slide-left';
        }else{
          this.transitionName = 'slide-right';
        }
      }
    }

  }
</script>

<style lang="stylus" rel="stylesheet/stylus">
  @import "../common/stylus/mixin.styl"
  html
    width 100%
    height 100%
    body
      overflow-x hidden
      font-size 14px
      width 100%
      height 100%
      background-color #EFEEF3
      .contentView
        overflow-x hidden
        box-sizing border-box
        overflow-y auto
        position absolute
        right 0
        top 45px
        bottom 0
        left 195px
  .slide-right-enter-active,
  .slide-right-leave-active,
  .slide-left-enter-active,
  .slide-left-leave-active {
    will-change: transform;
    transition: all 500ms;
    position: absolute;
  }
  .slide-right-enter {
    /*opacity: 0;*/
    transform: translate3d( 0, -100%,0);
  }
  .slide-right-leave-active {
    /*opacity: 0;*/
    transform: translate3d( 0, 100%, 0);
  }
  .slide-left-enter {
    /*opacity: 0;*/
    transform: translate3d( 0, 100%, 0);
  }
  .slide-left-leave-active {
    /*opacity: 0;*/
    transform: translate3d( 0, -100%, 0);
  }

</style>


